<style type="text/css">

.form-signin {
  max-width: 330px;
  padding: 15px;
  margin: 0 auto;
}
.form-signin .form-signin-heading,
.form-signin .checkbox {
  margin-bottom: 10px;
}
.form-signin .checkbox {
  font-weight: normal;
}
.form-signin .form-control {
  position: relative;
  height: auto;
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
  padding: 10px;
  font-size: 16px;
}
.form-signin .form-control:focus {
  z-index: 2;
}
.form-signin input[type="username"] {
  margin-bottom: -1px;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}
.form-signin input[type="password"] {
  margin-bottom: 10px;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
</style>

<div class="bg-custom col-md-9 col-md-offset-1" align="center">

      <form class="form-signin" role="form" action="/login/doLogin" method="post">
        <h1><span class="text-custom">Login</span></h1>
        <br>
        <input name="txtUsername" type="text" class="form-control" placeholder="Username" required autofocus>
        <br>
        <input name="txtPassword" type="password" class="form-control" placeholder="Password" required>
        <br>
<!--         <label class="checkbox"> -->
<!--           <input type="checkbox" value="remember-me"> Remember me -->
<!--         </label> -->
        <button class="btn btn-custom btn-block" type="submit" style="margin-bottom:5px;">Login</button>
<!--         <br/> -->
        <center><small>Don't have an account?</small></center>
        <button class="btn btn-custom btn-block" type="button" id="btnRegister" style="margin-bottom:10px;margin-top:5px;">Register</button>
        
      </form>

    </div>
<script type="text/javascript">
    document.getElementById("btnRegister").onclick = function () {
        location.href = "/register/register";
    };
</script>